body{
    padding: 6.3rem 0 4.5rem 0;
}

.top{
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    background-color: #ffffff;
}
.header-bar{
    padding: 0.35rem 0;
    display: flex;
    align-items: center;
    background-color: #ffffff;
}
.header-bar .logo{
    flex: 0 0 19.8%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.header-bar .logo img{
    width: 5.3rem;
}
.header-bar .search{
    flex: 1 1 auto;
    position: relative;
}
.header-bar .search span{
    width: 1rem;
    height: 1rem;
    background: url("../img/icon_search.png") no-repeat center center;
    background-size: 1rem 1rem;
    position: absolute;
    top: 50%;
    left: 0.8rem;
    transform: translateY(-50%);
  
}
.header-bar .search input{
    background-color: rgb(245,245,245);
    width: 100%;
    height: 2.8rem;
    text-indent: 2.8rem;
    border-radius: 28px;
    font-size: 1rem;
    color: rgb(172,172,172);
}
.header-bar .user{
    flex: 0 0 23.4%;
    height: 2rem;
    display: flex;
}
.header-bar .user .message{
    flex: 0 0 2rem;
    padding-left: 1.4rem;
}
.header-bar .user .message a{
    width: 2rem;
    height: 2rem;
    background: url("../img/icon_message_black.png") no-repeat center center;
    background-size: 2rem 2rem;
}
.header-bar .user .login{
    flex: 1 1 auto;
    font-size: 1.1rem;
    text-align: center;
    height: 2rem;
    line-height: 2rem;
}

.nav-menu{
    position: relative;
    overflow: hidden;
    background-color: #ffffff;
}
.nav-menu ul{
    width: 150%;
    display: flex;
}
.nav-menu ul li{
    line-height: 2.9rem;
    padding: 0 1.4rem;
    line-height: 2.5rem;
   
}
.nav-menu ul li a{
    font-size: 1.2rem;
    text-align: center;
    color: rgb(119,119,119);
    border-bottom: 4px solid transparent;
}
.nav-menu ul li.con a{
    border-color:rgb(204,14,17);
    color: rgb(204,14,17);
}

.nav-menu .more-arrow{
    width: 3.3rem;
    height: 2.5rem;
    background: #ffffff url("../img/more_down.png") no-repeat center center;
    position: absolute;
    top: 0;
    right: 0;
}

.banner{
    width: 100%;
    height: 13.1rem;
    overflow: hidden;
    padding-top: 0.4rem;
    position: relative;
    background-color: #ffffff;
}
.banner>ul{
    width: 200%;
    display: flex;
}
.banner>ul>li{
    padding: 0 0.5rem;
    
  
}
.banner>ul>li img{
    border-radius: 12px;
    width: 100%;
}
.banner .point-btn{
    position: absolute;
    bottom: 0.9rem;
    right: 1.1rem;
}
.banner .point-btn ul{
    display: flex;
}
.banner .point-btn ul li{
    width: 0.35rem;
    height: 0.35rem;
    border-radius: 50%;
    border: 1px solid #ffffff;
    margin-right: 0.3rem;
}
.banner .point-btn ul li.con{
    background-color: #ffffff;
}

.category{
    width: 100%;
    overflow: hidden;
    background: url("../img/bg-home-squard.png") no-repeat  center 0px;
    background-size: 100%;
    position: relative;
}
.category ul{
    display: flex;
    width: 200%;
}
.category ul li{
    padding:3.5rem 1.4rem 1.3rem 1.4rem;
    text-align: center;
}
.category ul li a{
    color: rgb(80,80,80);
    font-size: 0.9rem;
}
.category ul li .c-icon{
    width: 2.7rem;
    height: 2.7rem;
    margin: 0px auto 0.7rem auto;
    background: url("../img/icon.png") no-repeat;
    background-size:auto 100%;
}
.category ul li:nth-child(2) .c-icon{
    background-position-x: 11%;
}
.category ul li:nth-child(3) .c-icon{
    background-position-x: 22%;
}
.category ul li:nth-child(4) .c-icon{
    background-position-x: 33%;
}
.category ul li:nth-child(5) .c-icon{
    background-position-x: 44%;
}
.category ul li:nth-child(6) .c-icon{
    background-position-x: 55%;
}

.menu-index{
    width: 100%;
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 0.45rem;
}
.menu-index span{
    width: 2.5%;
    height: 0.2rem;
    margin-right: 0.3rem;
    background-color: rgb(244,244,244);
    text-indent: 50rem;
}
.menu-index span.con{
    background-color: rgb(79,79,79);
}

.headerline{
    height: 3.3rem;
    padding: 0px 1.5rem;
    display: flex;
    align-items: center;
    font-size: 1rem;
    background-color: #ffffff;
}
.headerline .hl-icon{
    flex: 0 0 16.3%;
}
.headerline .hl-icon img{
    height: 1.1rem;
}
.headerline .hl-content{
    flex: 1 1 auto;
    width: 100%;
    height: 100%;
    overflow: hidden;
   
}
.headerline .hl-content ul{
    width: 100%;
}
.headerline .hl-content ul li{
    width: 100%;
    height: 3.2rem;
    line-height: 3.2rem;
    position: relative;
    
}
.headerline .hl-content ul li span{
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background-color: rgb(197,197,197);
    position: absolute;
    left: 0.7rem;
    top: 50%;
    transform: translateY(-50%);

}
.headerline .hl-content ul li a{
    color: rgb(38,38,38);
    padding-left: 1.8rem;
    
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.headerline .hl-more{
    flex: 0 0 7%;
    padding-left: 1.4rem;
}
.headerline .hl-more a{
    
}

.seckill{}
.seckill h2{
    font-size: 1.4rem;
    line-height: 4rem;
    font-weight: 500;
    color: rgb(29,29,29);
    text-align: center;
    
}
.seckill h2 .seckill-icon{
    width: 0.9rem;
    height: 1.4rem;
    display: inline-block;
    vertical-align: middle;
    background: url("../img/seckill_title.png") no-repeat center center;
}
.seckill h2 .seckill-end{
    font-size: 0.9rem;
    color: rgb(152,152,152);
    vertical-align: top;
}

.seckill .seckillSlider{
    width: 100%;
    overflow: hidden;
}
.seckill .seckillSlider ul{
    width: 200%;
   display: flex;
}
.seckill .seckillSlider ul li{
    margin:0px 0.5rem;
    text-align: center;
}
.seckill .seckillSlider ul li a{
    width: 100%;
    display: inline-block;
}
.seckill .seckillSlider ul li .seckill-img{
    width: 100%;
    padding-top: 0.35rem;
    background-color: #ffffff;
    border-radius: 12px;
}
.seckill .seckillSlider ul li .seckill-img img{
    width: 5.1rem;
    display: inline-block;
  
}
.seckill .seckillSlider ul li .seckill-img p{
    font-size: 0.7rem;
    line-height: 1.7rem;
}
.seckill .seckillSlider ul li a>p{
    font-size: 0.9rem;
    color: rgb(203,30,39);
    line-height: 2.2rem;
}
.seckill .seckillSlider ul li a>p del{
    font-size: 0.7rem;
    color: rgb(121,121,121);
}

.product-poster{
    width: 100%;
    background-color: #ffffff;
}
.product-poster ul li{
    padding:0 0.5rem;
    display: flex;
    justify-content: space-between;
}
.product-poster ul li>div{
    flex: 1;
}
.product-poster ul li>div img{
    width: 100%;
}
.product-poster ul li>div.normal:nth-child(2){
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.product-poster ul li:last-child>div{
    padding: 0.8rem 0;
    text-align: center;
    background-color: rgb(249,249,249);
}
.product-poster ul li:last-child>div{
    margin: 0 0.2rem;
}
.product-poster ul li:last-child>div:first-child{
    border-bottom-left-radius: 0.5rem;
    margin: 0;
}

.product-poster ul li:last-child>div:last-child{
    border-bottom-right-radius: 0.5rem;
    margin: 0;
}

.product-poster ul li:last-child img{
    width: 6.6rem;
}
.product-poster ul li:last-child .p-info{
    margin-top: 1.7rem;
}

/*
    产品名称 
    促销标题 
    价格公共样式 
*/
.p-name{
    font-size: 1rem;
    font-weight: 500;
    color: rgb(51,51,51);
}
.p-promotion{
    font-size: 0.9rem;
    line-height: 1.8rem;
}
.p-price{
    font-size: 1rem;
    color: rgb(51,51,51);
}

.goods{
    padding: 0 0.5rem;
}
.goods header{
    line-height: 5.1rem;
    text-align: center;
}
.goods header h2{
    font-size: 1.1rem;
    font-weight: 500;
}
.goods{
    background-color: #ffffff;
    overflow: hidden;
    margin-bottom: 0.9rem;
}
.goods-list ul{
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.6rem;
}
.goods-list ul li{
    width: 50%;
}
.goods-list ul li{
    margin:0 0.3rem;
}
.goods-list ul li:first-child{
   margin-left: 0;
}
.goods-list ul li:last-child{
   margin-right: 0;
}

.goods-list ul li a{
    width: 100%;
    text-align: center;
}
.goods-list ul li a .goods-img{
    width: 100%;
    padding-top: 2.05rem;
    background-color: rgb(249,249,249);
    text-align: center;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 0.9rem;
    position: relative;
}
.goods-list ul li a .goods-img .tag{
    font-size: 0.8rem;
    line-height: 1.4rem;
    color: #ffffff;
    background-color: rgb(255,106,110);
    padding:0 0.9rem;
    border-bottom-left-radius:0.2rem ;
    border-bottom-right-radius:0.2rem ;

    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.goods-list ul li a .goods-img img{
    width: 72%;
    display: inline-block;
}
.goods-list ul li a .goods-img>p{
    line-height: 2.1rem;
    font-size: 1rem;
    background-color: rgb(240,240,240);
}
.goods-list ul li a .p-price{
    color: rgb(186,0,0);
}

.goods-list ul li a .p-price del{
    color: rgb(153,153,153);
}

.nav-bar{
    width: 100%;
    height: 4.5rem;
    background-color: rgb(249,249,249);
    position: fixed;
    bottom: 0px;
    left: 0;
    z-index: 9999;
}
.nav-bar ul{
    height: 100%;
    display: flex;
}
.nav-bar ul li {
  flex: 1;
  height: 100%;
}
.nav-bar ul li a{
    display: inline-block;
    width: 100%;
    height: 100%;
    text-align: center;
    vertical-align: middle;
}

.nav-bar ul li a i{
    display:block;
    width: 2.1rem;
    height: 2.1rem;
    margin: 0.5rem auto 0.35rem auto;
    background: url("../img/navbar1.png") no-repeat center;
    background-size: auto 100%;
}
.nav-bar ul li a b{
    font-size: 0.9rem;
    font-weight: 500;
}
.nav-bar ul li:nth-child(2) a i{
   background-image: url("../img/navbar2.png");
}
.nav-bar ul li:nth-child(3) a i{
   background-image: url("../img/navbar3.png");
}
.nav-bar ul li:nth-child(4) a i{
   background-image: url("../img/navbar4.png");
}
.nav-bar ul li:nth-child(5) a i{
   background-image: url("../img/navbar5.png");
}



